import chartConfig from "./chartConfig"

// 设备前五排排行
const getDeviceRank = (arrs) => {

  if (arrs == {} || arrs == null || arrs == undefined) {
    console.log("arr传空");
    arrs = {
      types: [
        "-",
        "-",
        "-",
        "-",
        "-",
      ],
      data: [0,0,0,0,0]
    };
  }

  let deviceRank = {
    color: ["#3398DB"],
    tooltip: {
      trigger: "axis",
      axisPointer: {
        // 坐标轴指示器，坐标轴触发有效
        type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
      },
    },
    grid: {
      left: "5%",
      right: "5%",
      bottom: "5%",
      containLabel: true,
    },
    xAxis: [
      {
        type: "category",
        data: arrs.types,
        axisTick: {
          alignWithLabel: true,
        },
        axisLabel: {
          color: chartConfig.c_font_color,
          fontSize: chartConfig.c_font_size,
          interval: 0,
          rotate: 30,
        },
      },
    ],
    yAxis: [
      {
        type: "value",
        name: "使用数量",
        nameTextStyle: {
          color: chartConfig.c_font_color,
          fontSize: chartConfig.c_font_size + 2,
        },
        axisLabel: {
          color: chartConfig.c_font_color,
          fontSize: chartConfig.c_font_size + 2,
        },
      },
    ],
    series: [
      {
        name: "直接访问",
        type: "bar",
        barWidth: "60%",
        data: arrs.data,
        label: {
          show: true,
          formatter: "{c}",
        },
      },
    ],
  };

  return deviceRank
}


// 设备状态
const getDeviceStatus = (arrs) => {

  if (arrs == {} || arrs == null || arrs == undefined) {
    console.log("arr传空");
    arrs = {
      types: [
        "-",
        "-",
        "-",
        "-",
        "-",
        "-",
      ],
      data: [
      { value: 0, name: "-" },
      { value: 0, name: "-" },
      { value: 0, name: "-" },
      { value: 0, name: "-" },
      { value: 0, name: "-" },
      { value: 0, name: "-" },
    ]
    };
  }

  let deviceStatus = {
    color: chartConfig.c_color_arr_6,
    tooltip: {
      trigger: "item",
      formatter: "{b}: {c} ({d}%)",
    },
    legend: {
      orient: "vertical",
      right: 10,
      data: arrs.types,
      textStyle: {
        color: chartConfig.c_font_color,
        fontSize: chartConfig.c_font_size,
      },
    },
    series: [
      {
        type: "pie",
        radius: ["20%", "80%"],
        avoidLabelOverlap: false,
        label: {
          show: true,
          position: "outside",
          fontSize: chartConfig.c_font_size,
          formatter: "{b}: {c}",
          color: chartConfig.c_font_color,
        },
        emphasis: {
          label: {
            show: true,
            fontSize: chartConfig.c_font_size + 2,
            fontWeight: "bold",
          },
        },
        labelLine: {
          show: false,
        },
        data: arrs.data,
      },
    ],
  };
  return deviceStatus
}


// 设备年度趋势
const getDeviceTrend = (arrs) => {

  if (arrs == {} || arrs == null || arrs == undefined) {
    console.log("arr传空");
    arrs = {
      types: [
        "-",
        "-",
        "-",
        "-",
        "-",
      ],
      data: [0,0,0,0,0]
    };
  }

  let deviceTrend = {
    tooltip: {
      trigger: "axis",
    },
    // legend: {
    //   data: ["锅炉", "压力容器", "电梯", "起重机械", "气瓶", "游乐设施"],
    //   textStyle: {
    //     color: chartConfig.c_font_color,
    //     fontSize: 14,
    //   },
    // },
    grid: {
      left: "3%",
      right: "5%",
      bottom: "3%",
      containLabel: true,
    },
    xAxis: {
      type: "category",
      boundaryGap: false,
      data: arrs.types,
      axisLabel: {
        color: chartConfig.c_font_color,
        fontSize: chartConfig.c_font_size,
      },
    },
    yAxis: {
      type: "value",
      name: "设备数量",
      nameTextStyle: {
        color: chartConfig.c_font_color,
        fontSize: chartConfig.c_font_size + 2,
      },
      axisLabel: {
        color: chartConfig.c_font_color,
        fontSize: chartConfig.c_font_size + 2,
      },
    },
    series: [
      {
        name: "设备",
        type: "line",
        stack: "总量",
        data: arrs.data,
        label: {
          show: true,
          formatter: "{c}",
          color: "#67e0e3",
        },
        lineStyle: {
          color: "#67e0e3",
          width: 3,
        },
      },
    ],
  };
  return deviceTrend
}


// 使用年限统计
const getDeviceYears = (arrs) => {

  if (arrs == {} || arrs == null || arrs == undefined) {
    console.log("arr传空");
    arrs = {
      types: [
        "-",
        "-",
        "-",
        "-",
        "-",
      ],
      data: [0,0,0,0,0]
    };
  }

  let deviceYears = {
    grid: {
      top: "15%",
      left: "3%",
      right: "5%",
      bottom: "3%",
      containLabel: true,
    },
    xAxis: {
      type: "category",
      data: arrs.types,
      axisLabel: {
        color: chartConfig.c_font_color,
        fontSize: chartConfig.c_font_size + 2,
      },
    },
    yAxis: {
      type: "value",
      name: "设备数量",
      nameTextStyle: {
        color: chartConfig.c_font_color,
        fontSize: chartConfig.c_font_size + 2,
      },
      axisLabel: {
        color: chartConfig.c_font_color,
        fontSize: chartConfig.c_font_size + 2,
      },
    },
    series: [
      {
        data: arrs.data,
        type: "bar",
        showBackground: true,
        backgroundStyle: {
          color: "rgba(220, 220, 220, 0.2)",
        },
        itemStyle: {
          normal: {
            color: function(params) {
              var colorlist = chartConfig.c_color_arr_3;
              return colorlist[params.dataIndex];
            },
            barBorderRadius: [5, 5, 0, 0],
          },
        },
        label: {
          show: true,
          formatter: "{c}",
          textStyle: {
            fontSize: chartConfig.c_font_size + 2
          }
        },
      },
    ],
  };
  return deviceYears
}


// export default deviceCountOption

export {
  getDeviceRank,
  getDeviceStatus,
  getDeviceTrend,
  getDeviceYears
}